import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';
import 'package:provider/provider.dart';
import 'package:recipe/detail.dart';
import 'package:recipe/global.dart';
import 'package:recipe/http-manager.dart';
import 'package:recipe/main_manager.dart';
import 'package:recipe/utils.dart';

class LikePage extends StatefulWidget {
  LikePage({Key key}) : super(key: key);
  @override
  _LikePageState createState() => _LikePageState();
}

class _LikePageState extends State<LikePage> {
  @override
  void initState() {
    super.initState();
  }

  List<Widget> renderMaterial(material) {
    List<Widget> list = [];
    String materialstr = json.encode(material);
    final _material = json.decode(materialstr);
    List.generate(_material.length, (index) {
      String str = json.encode(_material[index]);
      final item = json.decode(str);
      list.add(
        Text(
          "${item['name']}/${item['num']}",
          style: TextStyle(
            fontSize: 10,
            color: Global.fontSecondColor,
            fontWeight: FontWeight.w400,
          ),
        ),
      );
    });
    return list;
  }

  List<Widget> renderRecipeList(recipeDateList, _mainManager) {
    List<Widget> list = [];
    List.generate(recipeDateList.length, (index) {
      String str = json.encode(recipeDateList[index]);
      final item = json.decode(str);
      list.add(
        InkWell(
            onTap: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => DetailPage(id: item['id'].toString()),
                ),
              );
            },
            child: Container(
              decoration: BoxDecoration(color: Global.cardBackgroundColor),
              padding: EdgeInsets.all(8),
              width: MediaQuery.of(context).size.width,
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.start,
                children: [
                  Container(
                    width: 70,
                    child: ClipRRect(
                      borderRadius: BorderRadius.all(Radius.circular(5)),
                      child: FadeInImage.assetNetwork(
                        placeholder: 'assets/images/20201014150850.jpg',
                        fadeInDuration: const Duration(milliseconds: 500),
                        image: item['cover'],
                      ),
                    ),
                  ),
                  SizedBox(width: 10),
                  Expanded(
                      child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Text(
                        item['title'],
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                        style: TextStyle(
                          color: Global.primaryColor,
                          fontSize: 14,
                          fontWeight: FontWeight.w500,
                        ),
                      ),
                      Wrap(
                        spacing: 5,
                        runSpacing: 1,
                        children: renderMaterial(item["material"]),
                      ),
                    ],
                  )),
                  IconButton(
                    icon: Icon(Icons.delete),
                    iconSize: 25,
                    tooltip: '删除',
                    onPressed: () {
                      Utils.showConfirmDialog(
                        context: context,
                        content: '确定取消收藏 ${item['title']} ？',
                        showCancelButton: true,
                        confirmCallback: () {
                          _mainManager.like(item);
                        },
                      );
                    },
                  ),
                ],
              ),
            )),
      );
    });
    return list;
  }

  @override
  Widget build(BuildContext context) {
    MainManager _mainManager = Provider.of<MainManager>(context);
    return _mainManager.likeList.length == 0
        ? Center(
            child: Text(
            "收藏的菜谱在这里展示哦，快去寻找喜欢的菜谱吧！",
            style: TextStyle(color: Global.fontSecondColor),
          ))
        : Scaffold(
            appBar: AppBar(
              toolbarHeight: 40,
              elevation: 0,
              title: Text(
                "我的收藏",
                style: TextStyle(
                  color: Global.backgroundColor,
                  fontSize: 13,
                ),
              ),
            ),
            body: Container(
              child: SingleChildScrollView(
                child: Wrap(
                  children:
                      renderRecipeList(_mainManager.likeList, _mainManager),
                ),
              ),
            ),
          );
  }
}
